<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<%@ include file="/web/header.jsp" %>
<title>Insert title here</title>
</head>
<body>
<div class="layui-collapse">
  <div class="layui-colla-item">
    <h2 class="layui-colla-title">项目信息</h2>
    <div class="layui-colla-content layui-show">
		<fieldset class="layui-elem-field layui-field-title">
		  <legend>查询条件</legend>
		  <div class="layui-field-box">
			  <form class='layui-form'>
			  	  <div class="layui-form-item">
				    <label class="layui-form-label">项目编号</label>
				    <div class="layui-input-inline">
				      <input type="text" name="code" 
				        placeholder="请输入项目编号" autocomplete="off" class="layui-input">
				    </div>
				    <label class="layui-form-label">项目名称</label>
				    <div class="layui-input-inline">
				      <input type="text" name="name" 
				        placeholder="请输入项目名称" autocomplete="off" class="layui-input">
				    </div>
				    <label class="layui-form-label"></label>
				    <div class="layui-input-inline">
				      <input type="button"  class="layui-btn" lay-submit lay-filter='sel' value='查询'>
				      <input type="reset"  class="layui-btn layui-btn-primary" value='重置'>
				    </div>
				    <input type="button"  class="layui-btn"  value='添加' onclick='openAdd()'>
				  </div>
				 <!--  <input type="hidden" name="action" value="sel"  /> -->
				  <input type="hidden" name="action" value="list"  />
				  <input type="hidden" name="pageIndex" value="1"  />
				  <input type="hidden" name="pageLimit" value="10"  />
			  </form>
		  </div>
		</fieldset>
	</div>
  </div>
</div>

<div>
	<table class='layui-table'>
		<colgroup>
			<col width='10%'><col width='20%'><col width='20%'><col width='20%'><col>
		</colgroup>
		<thead>
			<tr>
				<th>序号</th><th>编号</th><th>名称</th><th>时间</th><th>操作</th>
			</tr>
		</thead>
		<tbody id='user_tbody'></tbody>
	</table>
	<div id="pageInfo" style="text-align:right;padding-right:30px"></div>
</div>	 
	
<script type="text/javascript">
	element.render();
	
	formOn("/project",'submit(sel)',"json",function(data){
// 		console.log(data)
		var pageIndex=$("input[name='pageIndex']").val();
		var pageLimit=$("input[name='pageLimit']").val();
		setPageInfo('pageInfo',data.count,pageIndex,pageLimit,function(obj, first){
			$("input[name='pageIndex']").val(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
		    $("input[name='pageLimit']").val(obj.limit); //得到每页显示的条数
		    if(!first){//首次不执行
		    	refresh();//do something
		    } 
		})
//调用写在js里的方法
// 		laypage.render({
// 			elem:"pageInfo",
// 			count:data.count,//数据总数
// 			curr:pageIndex,
// 			limit:pageLimit,
// 			limits:[10,20,30,40,50,60],
// 			layout:['count','prev','page','next','limit','refresh','skip'],
// 			jump:function(obj, first){//obj（当前分页的所有选项值）、first（是否首次，一般用于初始加载的判断）
// 			    $("input[name='pageIndex']").val(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
// 			    $("input[name='pageLimit']").val(obj.limit); //得到每页显示的条数
// 			    if(!first){//首次不执行
// 			    	refresh();//do something
// 			    } 
// 			  }
// 		})
//count（总条目输区域）、prev（上一页区域）、page（分页区域）、next（下一页区域）、limit（条目选项区域）、refresh（页面刷新区域。注意：layui 2.3.0 新增） 、skip（快捷跳页区域）
		var html=''
		$.each(data.data,function(index,element){
			//element.id=index+1;
			element.id=(index+1)+(pageIndex-1)*pageLimit;
			html+=laytpl($("#tradd").html()).render(element)
		}) 
		$("#user_tbody").html(html);
	})
	
// 	formOn("/department",'submit(sel)',"json",function(data){
// 		console.log(data)
// 		var html=''
// 		$.each(data,function(index,element){
// 			element.id=index+1;
// 			html+=laytpl($("#tradd").html()).render(element)
// 		})
// 		$("#user_tbody").html(html);
// 	})
	refresh();//打开网页执行一次查询
	function refresh(){
		$("input[value='查询']").click();
	}
	
	function openAdd(){
		layer.open({
			type:2,//iframe
			area:['750px','450px'],
			maxmin:true,
			end:function(){
				refresh();
			},
			content:base.app+"/web/page/project/add.jsp"
		})
// 		openLayer("/web/page/department/add.jsp",refresh)
// 		refresh();
	}
	
	function del(code){
		layer.confirm("确定进行该操作？", {icon: 3, title:'提示'}, function(index){
			ajax("/project",{code:code,action:'del'},'text',function(data){
				if("1"==data){
					layer.msg("删除成功",refresh)
				}else{
					layer.msg("删除失败")
				}
			})
		});
	}
	 
	function openUpd(code){
		 layer.open({
			type:2,//iframe
			area:['750px','450px'],
			maxmin:true,
			end:function(){
				refresh();
			},
			content:base.app+"/web/page/project/upd.jsp?code="+code
		}) 
// 		openLayer("/web/page/department/upd.jsp",refresh)
	}
</script>
<!-- 模板引擎 -->
<script type="text/html" id='tradd'>
<tr>
	<td>{{d.id}}</td>
	<td>{{d.code}}</td>
	<td>{{d.name}}</td>
	<td>{{d.time}}</td>
 	<td>
		<input onclick="del('{{d.code}}')" type='button' value='删除' class='layui-btn layui-btn-sm layui-btn-danger'>
		&nbsp 
		<input onclick="openUpd('{{d.code}}')" type='button' value='修改' class='layui-btn layui-btn-sm '>
	</td>
</tr>

</script>
</body>
</html>